<template>
  <template v-if="inited">
<!--    {{widgetConfig.enums}}-->
    <el-cascader
        v-model="state.value"
        v-bind="state.OPT.widgetConfig"
        v-on="listeners"
        :options="buildOptions()"
    ></el-cascader>
  </template>

</template>

<script>
import {CustomRenderControlMixin, defineCustomRender} from "@/plugins/form-render/utils/index.js";
import { createBaseCusCONFIG} from "@/plugins/z-frame/CusBaseEditor";
import ZCascader from "@/plugins/z-frame/components/ZCascader.vue";

export default {
  name: 'CusCascader',
  components: {ZCascader},
  mixins: [
      CustomRenderControlMixin
  ],
  CUS_TITLE: '级联',
  CUS_EDITOR: function () {
    return {
      props: {
        ...createBaseCusCONFIG(),
        tree_options: {
          type: 'string',
          ui: {
            // widget: 'CodeJsEditor',
            styles: [
              ['height', 0],
              ['overflow', 'hidden'],
            ],
            widgetConfig: {
              type: 'textarea',
              readonly: true
            }
          },
          computedProp: 'tree_ui_options_to_tree_options',
        },
        tree_ui_options: {
          type: 'string',
          ui: {
            label: '树编辑',
            widget: 'CusTreeEditor'
          }
        },
      },
      computed: {
        tree_ui_options_to_tree_options: `A.get_tree_ui_options_to_tree_options(MODEL('ui.widgetConfig.tree_ui_options'))`
      }
    }
  },
  setup(props, ctx) {
    let { data, methods, listeners, init, widgetConfig2, buildOptions } = defineCustomRender(props, ctx)
    let state = data()
    init(props)

    return {
      state,
      buildOptions,
      widgetConfig: widgetConfig2,
      methods,
      listeners,
    }
  },
}
</script>

